21 Geolocation 中文指南


    由于笔记本电脑一般不带速度及方向传感器，从结果中可以看到返回值中heading及speed键值均为null,为演示可视化效果，代码中采用手动赋值的方式进行演示。

    1.有关地理位置接口Geolocation的说明，可查看MDN中的相关解释。

    • enableHighAccuracy参数表示是否高精度可用，为Boolean类型，默认为false，如果开启，响应时间会变慢，同时，在手机设备上会用掉更多的流量，也就是money了。
    • timeout参数表示等待响应的最大时间，默认是0毫秒，表示无穷时间。

    1.使用getCurrentPosition()方法获得相关信息

    2.当成功返回结果时，在控制台输出结果，并根据结果对相应的DOM元素进行样式调整 

    1. function success(pos) {
    2.   console.log(pos);
    4.   console.log('Your current position is:');
    5.   console.log('Latitude : ' + crd.latitude);
    6.   console.log('Longitude: ' + crd.longitude);
    8.   //改变传感器速度值和罗盘的指向
    9.    speed.innerHTML = crd.speed;
    10.    arrow.style.transform = `rotate(${crd.heading}deg)`;
    12. };